// *******************************************************************************************************
// # テキスト
// *******************************************************************************************************

// テキスト
//
// #### export common.css
// ※このページでは表示が完全に再現されず、部分的に崩れている場合があります。  
// ※class名やデザインの参考まで
//
// Styleguide 3.0

/* ------------------------------------
	* テキスト
* ------------------------------------ */


// テキストリンク：アローリンク
//
// .mod_link_arrow.mod_link_arrow_orange - オレンジ
// .mod_link_arrow.mod_link_arrow_blue - ブルー
// .mod_link_arrow.mod_link_arrow_white - ホワイト
// .mod_link_arrow.mod_link_arrow_gray - グレー
//
// Markup:
// <a href="#dummy" class="{$modifiers}">問い合わせるだけ！お得なキャンペーン実施中</a>
//
// Styleguide 3.1

/* --------------------------
	* mod_link_arrow
* -------------------------- */
.mod_link_arrow {
	@extend %linkArrow;
}

.mod_link_arrow_orange {
	color: $textColorOrange;
	background-image: url(#{$imgPathCommon}icon/arr_link_orange.png);
	font-weight: bold;

	&:hover {
		color: $textColorOrangeHover;
	}
}

.mod_link_arrow_blue {
	background-image: url(#{$imgPathCommon}icon/arr_link_blue.png);
}

.mod_link_arrow_white {
	color: #fff;
	background-image: url(#{$imgPathCommon}icon/arr_link_white.png);

	&:hover {
		color: #fff;
	}
}

.mod_link_arrow_gray {
	background-image: url(#{$imgPathCommon}icon/arr_link_gray.png);
}


// テキストリンク：ブルーリンク
//
// .mod_link_blue - サンプル
//
// Markup:
// <a href="#dummy" class="mod_link_blue">クリアする</a>
//
// Styleguide 3.2

/* --------------------------
	* mod_link_blue
* -------------------------- */
.mod_link_blue {
	color: $textColorHover;
	font-weight: bold;
	text-decoration: none;

	&:hover {
		color: #82a9eb;
	}
}


// テキストリンク：デバイス
//
// .mod_link_txt - サンプル
//
// Markup:
// <a href="javascript: void(0);" class="mod_link_txt">他12駅▼すべて表示</a>
//
// Styleguide 3.3

/* --------------------------
	* mod_link_txt
* -------------------------- */
.mod_link_txt {
	@include modLinkTxt;
}


// アパマンショップを探す：1行
//
// .mod_link_apaman - sample
//
// Markup:
// <a href="#dummy" class="mod_link_apaman">アパマンショップを探す</a>
//
// Styleguide 3.4

// アパマンショップを探す：2行
//
// .mod_link_apaman2 - sample
//
// Markup:
// <a href="#dummy" class="mod_link_apaman2"><strong>神奈川県</strong>の<br />アパマンショップを探す</a>
//
// Styleguide 3.5

/* --------------------------
	* mod_link_apaman, mod_link_apaman2
* -------------------------- */
.mod_link_apaman, .mod_link_apaman2 {
	@extend .mod_link_blue;
	padding-top: 10px;
	padding-left: 50px;
	@include inline-block;
	@include min-height(21px);
	vertical-align: middle;
	background: url(#{$imgPathCommon}icon/icn_link_apaman.png) no-repeat 0px 0px;
}

.mod_link_apaman2 {
	padding-top: 0;
	line-height: 1.3;
	background-position: 0px 2px;

	strong {
		color: $textColorPink;
	}
}

div#appendContainer {
	.txt_link {
		position: absolute;
		left: 12px;
		top: 16px;
	}
}


// 賃貸物件を探す：1行
//
// .mod_link_chintai - sample
//
// Markup:
// <a href="#dummy" class="mod_link_chintai">賃貸物件を探す</a>
//
// Styleguide 3.6

// 賃貸物件を探す：2行
//
// .mod_link_chintai2 - sample
//
// Markup:
// <a href="#dummy" class="mod_link_chintai2"><strong>神奈川県</strong>の<br />賃貸物件を探す</a>
//
// Styleguide 3.7

/* --------------------------
	* mod_link_chintai, mod_link_chintai2
* -------------------------- */
.mod_link_chintai, .mod_link_chintai2 {
	@extend .mod_link_blue;
	padding-top: 10px;
	padding-left: 50px;
	@include inline-block;
	@include min-height(21px);
	vertical-align: middle;
	background: url(#{$imgPathCommon}icon/icn_link_chintai.png) no-repeat 0px 0px;
}

.mod_link_chintai2 {
	padding-top: 0;
	line-height: 1.3;
	background-position: 0px 2px;

	strong {
		color: $textColorPink;
	}
}

